//
//  ApprovePersonalInfoView.swift
//  GoCash
//
//  Created by jie on 2024/5/15.
//

import SwiftUI

struct ApprovePersonalInfoView: View {
    var body: some View {
        ZStack {
            Color(hex: 0xF8F7FE).ignoresSafeArea()
            VStack {
                ScrollView(showsIndicators: false) {
                    ApproveProgressIndecateView()
                    VStack(spacing: 0) {
                        Color.white.frame(height: 20).cornerRadius(16)
                        ApproveSelectedItem(title: .constant("Tipo de empleo"),
                                            placeholder: .constant("Seleccione"),
                                            optionsKey: .constant(""))
                        ApproveSelectedItem(title: .constant("Ingreso mensual"),
                                            placeholder: .constant("Seleccione"),
                                            optionsKey: .constant(""))
                        ApproveSelectedItem(title: .constant("Nivel educativo"),
                                            placeholder: .constant("Seleccione"),
                                            optionsKey: .constant(""))
                        ApproveSelectedItem(title: .constant("Estado Civil"),
                                            placeholder: .constant("Seleccione"),
                                            optionsKey: .constant(""))
                        ApproveSelectedItem(title: .constant("Dirrección"),
                                            placeholder: .constant("Seleccione"),
                                            optionsKey: .constant(""))
                    }.overlay {
                        Rectangle().cornerRadius(16).foregroundColor(.clear)
                    }
                }
                
                Spacer()
                ApprovePageCommitView()
            }.padding(.top, 8)
        }   .edgesIgnoringSafeArea(.bottom)
            .navigationStyle(title: "Información personal", whiteType: false)
    }
}

#Preview {
    ApprovePersonalInfoView()
}



struct ApprovePageCommitView: View {
    var body: some View {
        VStack {
            Color(.white).frame(height: 16)
            Button(action: {}, label: {
                ZStack {
                    MAIN_COLOR.frame(height: 50).cornerRadius(8)
                    Text("Enviar").font(Font.system(size: 18, weight: .semibold)).foregroundColor(.white)
                }
            }).padding(.horizontal, 16)
            HStack {
                Image(systemName: "checkmark.shield").foregroundColor(COLOR_7C697C)
                Text("Protegemos su privacidad.").font(Font.system(size: 12)).foregroundColor(COLOR_7C697C)
            }
            Color(.white).frame(height: 20)
        }.background(.white)
    }
}


struct ApproveSelectedItem: View {
    
    @Binding var title: String
    @Binding var placeholder: String
    @Binding var optionsKey: String
    
    var body: some View {
        VStack(alignment: .leading, spacing: 0) {
            Text(title).font(Font.system(size: 12)).foregroundColor(COLOR_312A31).padding(0)
            Spacer()
            HStack {
                Text(placeholder).font(Font.system(size: 15)).foregroundColor(COLOR_BD9DBD).padding(0)
                Spacer()
                Image(systemName: "arrowtriangle.right.fill").resizable().frame(width: 8, height: 10).foregroundColor(COLOR_7C697C)
            }.padding(.top, 16)
            Spacer()
            Color(.clear).frame(height: 12)
            Divider().background(COLOR_EFEBF4)
        }
        .padding(EdgeInsets(top: 0, leading: 16, bottom: 16, trailing: 16)).background(.white)
        .onTapGesture {
            SwiftMessageManager.showBottom(content: ApproveOptionsAlert(options: [
                OptionModel(value: 1, isSel: true),
                OptionModel(value: 2),
                OptionModel(value: 3),
                OptionModel(value: 4),
                OptionModel(value: 5),
                OptionModel(value: 6),
            ]){ option in
                
            }
            )
        }
    }
}
